// 引入 nprogress 样式，用于页面加载进度条
import 'nprogress/nprogress.css';

// 引入 nprogress 模块
import NProgress from 'nprogress';
// 引入 TDesign 的消息提示组件
import { MessagePlugin } from 'tdesign-vue-next';
// 引入 Vue Router 的类型定义
import { RouteRecordRaw } from 'vue-router';

// 引入路由实例
import router from '@/router';
// 引入状态管理模块中的权限和用户相关 store
import { getPermissionStore, useUserStore } from '@/store';
// 引入常量：未找到页面的路由信息
import { PAGE_NOT_FOUND_ROUTE } from '@/utils/route/constant';

// 配置 nprogress 不显示加载 spinner
NProgress.configure({ showSpinner: false });

// 全局前置守卫：在路由跳转前执行
// 全局路由前置守卫，在每次路由跳转前执行
router.beforeEach(async (to, from, next) => {
  // 开始进度条动画
  NProgress.start();

  // 获取权限存储和路由白名单
  const permissionStore = getPermissionStore();
  const { whiteListRouters } = permissionStore;

  // 获取用户存储
  const userStore = useUserStore();

  // 如果用户已登录（存在token）
  if (userStore.token) {
    // 如果目标路径是登录页，直接放行（避免已登录用户重复登录）
    if (to.path === '/login') {
      next();
      return;
    }

    try {
      // 获取用户信息
      await userStore.getUserInfo();

      // 获取异步路由表
      const { asyncRoutes } = permissionStore;

      // 如果异步路由表为空，需要动态构建路由
      if (asyncRoutes && asyncRoutes.length === 0) {
        // 构建异步路由
        const routeList = await permissionStore.buildAsyncRoutes();
        // console.log('动态添加的路由列表:', routeList[1].children.pop());
        // 将生成的路由动态添加到路由器
        routeList.forEach((item: RouteRecordRaw) => {
          router.addRoute(item);
        });

        // 如果当前要跳转的是404页面
        if (to.name === PAGE_NOT_FOUND_ROUTE.name) {
          // 动态添加路由后，重定向到完整路径（解决动态路由添加后仍显示404的问题）
          next({ path: to.fullPath, replace: true, query: to.query });
        } else {
          // 处理重定向逻辑
          const redirect = decodeURIComponent((from.query.redirect || to.path) as string);
          // 如果目标路径就是重定向路径，则替换当前路由；否则跳转到重定向路径
          next(to.path === redirect ? { ...to, replace: true } : { path: redirect, query: to.query });
          return;
        }
      }

      // 检查路由是否存在
      if (router.hasRoute(to.name)) {
        // 路由存在，放行
        next();
      } else {
        // 路由不存在，重定向到首页
        next(`/`);
      }
    } catch (error) {
      // 出现错误时显示错误信息并跳转到登录页
      MessagePlugin.error(error.message);
      next({
        path: '/login',
        query: { redirect: encodeURIComponent(to.fullPath) },
      });
      // 结束进度条
      NProgress.done();
    }
  } else {
    /* 用户未登录的情况 */
    // 检查目标路由是否在白名单中
    if (whiteListRouters.indexOf(to.path) !== -1) {
      // 在白名单中，直接放行
      next();
    } else {
      // 不在白名单中，跳转到登录页，并携带重定向路径
      next({
        path: '/login',
        query: { redirect: encodeURIComponent(to.fullPath) },
      });
    }
    // 结束进度条
    NProgress.done();
  }
});

// 全局后置钩子：在路由跳转完成后执行
router.afterEach((to) => {
  if (to.path === '/login') {
    // 如果进入登录页
    const userStore = useUserStore();
    const permissionStore = getPermissionStore();

    userStore.logout(); // 清除用户信息
    permissionStore.restoreRoutes(); // 还原路由表
  }
  NProgress.done(); // 结束进度条
});
